import 'package:chat_shop/common/appbar/appbar.dart';
import 'package:chat_shop/common/const/cosnt.dart';
import 'package:chat_shop/page/friend/page/view/conversation_cell.dart';
import 'package:flutter/material.dart';
import 'package:zevent_bus/zevent_bus.dart';

class MsgChatPage extends StatefulWidget {
  final Map<String, dynamic> params;
  const MsgChatPage({Key? key, required this.params}) : super(key: key);
  @override
  _MsgChatPageState createState() => _MsgChatPageState();
}

class _MsgChatPageState extends State<MsgChatPage> {
  final List<String> list = [];
  final FocusNode _focusNode = FocusNode();
  final TextEditingController textEditingController = TextEditingController();
  final ScrollController _scrollController = ScrollController();
  bool moreAction = false;
  @override
  void initState() {
    super.initState();
  }

  @override
  void dispose() {
    textEditingController.dispose();
    _focusNode.dispose();
    super.dispose();
  }

  void _moreAction() {
    _focusNode.unfocus();
    setState(() {
      moreAction = true;
    });
  }

  void _onFocus() {
    setState(() {
      moreAction = false;
    });
  }

  void _onAlbum() {}

  void _onPhoto() {}

  void _onLocation() {}

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppbar.normal(
        title: widget.params["model"]["author"],
        onPress: () => Navigator.pop(context),
      ),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              reverse: false,
              controller: _scrollController,
              itemBuilder: (context, index) {
                return ConversationCell(
                  msgType: index,
                );
              },
              itemCount: list.length,
            ),
          ),
          Container(
            decoration: BoxDecoration(
              color: Colors.white,
            ),
            child: Row(
              children: [
                SizedBox(
                  width: 18,
                ),
                Icon(Icons.face_outlined),
                Expanded(
                  child: Container(
                    height: 39,
                    margin: const EdgeInsets.only(top: 10.5, bottom: 10.5, left: 12, right: 12),
                    alignment: Alignment.topLeft,
                    padding: const EdgeInsets.only(left: 8, right: 8, bottom: 3),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(100),
                    ),
                    child: TextField(
                      textInputAction: TextInputAction.next,
                      controller: textEditingController,
                      focusNode: _focusNode,
                      onTap: _onFocus,
                      onEditingComplete: () {
                        setState(() {
                          list.add(textEditingController.text);
                        });
                        textEditingController.clear();
                        _scrollController.animateTo(
                          _scrollController.position.maxScrollExtent,
                          duration: const Duration(milliseconds: 300),
                          curve: Curves.easeInOut,
                        );
                      },
                      decoration: InputDecoration(
                        hintText: "请输入内容",
                        border: InputBorder.none,
                        fillColor: Colors.transparent,
                        filled: true,
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: _moreAction,
                  behavior: HitTestBehavior.translucent,
                  child: Padding(
                    padding: const EdgeInsets.only(left: 12, right: 18.0),
                    child: Icon(Icons.send),
                  ),
                ),
              ],
            ),
          ),
          Visibility(
            visible: moreAction,
            child: Container(
              padding: const EdgeInsets.only(top: 21, left: 27.0),
              height: moreAction ? 100 : 0,
              alignment: Alignment.topLeft,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  _Item(
                    img: Icons.linked_camera,
                    title: "相册",
                    onTap: _onAlbum,
                  ),
                  _Item(
                    img: Icons.camera_alt,
                    title: "拍摄",
                    onTap: _onPhoto,
                  ),
                  _Item(
                    img: Icons.location_on_sharp,
                    title: "位置",
                    onTap: _onLocation,
                  ),
                  SizedBox(),
                  SizedBox(),
                ],
              ),
            ),
          )
        ],
      ),
    );
  }
}

class _Item extends StatelessWidget {
  final IconData img;
  final String title;
  final Function()? onTap;
  const _Item({Key? key, required this.img, required this.title, this.onTap}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Container(
          width: 39,
          height: 39,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(2),
          ),
          alignment: Alignment.center,
          child: Icon(
            img,
            size: 20,
            color: Colors.black12,
          ),
        ),
        const SizedBox(height: 3.5),
        Text(
          title,
        ),
      ],
    );
  }
}
